<!-- NG-ZORRO -->
<div id="app" style="min-width:900px;">
  <nz-layout class="layout">
    <nz-header class="header">
      <div class="wrap">
        <div class="left">
          <h1>Music</h1>
          <ul nz-menu nzTheme="dark" nzMode="horizontal">
            <li nz-menu-item>{{'Find' | translate}}</li>
            <li nz-menu-item>{{'SongLists'| translate}}</li>
          </ul>
        </div>
        <div class="rigt">
          <a nz-dropdown [nzDropdownMenu]="menu" style="color: aliceblue;">
            {{'language' | translate}}
            <i nz-icon nzType="down"></i>
          </a>
          <nz-dropdown-menu #menu="nzDropdownMenu">
            <ul nz-menu>
              <li nz-menu-item (click)="changeLanguage('zh')">中文</li>
              <li nz-menu-item (click)="changeLanguage('en')">英文</li>
            </ul>
          </nz-dropdown-menu>
        </div>
      </div>
    </nz-header>
    <router-outlet></router-outlet>
    <nz-footer class="footer">
      Ant Design ©2019 Implement By Angular
    </nz-footer>
  </nz-layout>
</div>

<app-player></app-player>